library(knitr)## Global optionsoptions(max.print="80")opts_chunk$set(echo=TRUE,cache=FALSE,prompt=FALSE,tidy=FALSE,comment=NA,message=FALSE,warning=FALSE,options(scipen=999))opts_knit$set(width=75)# Packages utilitaireslibrary(dplyr)
Attaching package: 'dplyr'
The following objects are masked from 'package:stats':
filter, lag
The following objects are masked from 'package:base':
intersect, setdiff, setequal, union
BUG WARNING : Il peut arriver que la transformation du fichier .Rmd en .html ne s’opère pas et que vous voyiez apparaître le message d’erreur suivant RMarkdown cannot knit: html_dependency not found. Ce message d’erreur persiste même après avoir corrigé le code… ce qui est très pénible. Après avoir cherché sur les forums de discussion, j’ai trouvé une première réponse sur stackoverflow qui consiste simplement à aller sur la flèche descendnate à droite du bouton knitr et effectuer un clear knitr cache avant de relancer le Knitr. Apparemment ça marche, sans que je sache bien pourquoi. Mais la solution la plus efficace semble être d’insérer une option cache=FALSE dans les options globales du fichier Markdown. Cela va sans doute un peu ralentir l’affichage des pages HTML,mais évite les problèmes. On pourra toujours rétablir cache=TRUE si nécessaire
Notre premier objectif très limité sera de construire une carte interactive utilisant le fonds de carte OpenStreetMap que l’on pourra zoomer en avant ou en arrière. La carte comportera la localisation de la place de la gare à Sucy-en-Brie avec une “épingle” de localisation comportant une photographie de la gare et un petit texte de promotion de celle-ci.
Lancement avec leaflet()
Nous allons avoir besoin des packages suivants :
leaflet puisque c’est l’objet même du cours !
dplyr afin de pouvoir construire des programmes utilisant des pipes %>%
sf pour charger des fonds de carte de différents types (points, lignes polygones)
htmltools et htmlwidgets pour ajouter des popups interactifs sur notre carte
Pour vérifier que le package leaflet est bien installé, nous créons une première carte (vide !)
map <-leaflet()map
Et il n’y a … RIEN ! si ce n’est un bouton de zoom
Remplissage avec addTiles()
On ajoute sur ce fond de carte vide des “tuiles” cartographiques qui sont des images se modifiant selon l’échelle pour apporter plus ou moins de détails. Par défaut, le fonds de carte de référence est le fonds OpenStreetMap
library(leaflet)map <-leaflet() %>%addTiles()map
La carte est désormais interactive et on peut effectuer des zooms ou se déplacer.
Calage avec setView()
Nous allons ensuite choisir un point de référence, par exemple la place de la gare à Sucy-en-Brie. Pour trouver les coordonnées de latitude et longitude, la solution la plus simple est d’utiliser Google Maps puis de zoomer sur la zone d’étude et enfin d’effectuer un click droit avec la souris sur le point dont on cherche les coordonnées pour obtenir dans un popup les coordonnées recherchées :
On peut alors procéder à une double opération de centrage de notre carte et de définition d’une échelle d’observation afin que la carte produite par leafletcouvre bien la zone qui nous intéresse. Cette double opération est réalisée à l’aide de la fonction setView() assortie des trois paramètre suivants :
lng = pour la longitude
lat = pour la latitude
zoom = pour le degré d’aggrandissement de la carte de 1 pour le Monde entier à 20 pour une vision ulra locale
Une fois qu’on a vérifié le centrage avec un zoom fort (ici 17), on peut refaire la carte en utilisant un zoom plus faible, par exemple un zoom de 12 permettant de visualiser toute la commune de Sucy et les communes voisines.
Les tuiles OpenStreetMap qui servent de fonds de carte par défaut peuvent être remplacés par des tuiles personalisées fournies par des producteurs publics ou privés. On peut obtenir la liste des tuiles disponibles en tapant providers dans la console de R studio et les tester une par une. Mais il est souvent plus simple et plus rapide d’aller visualiser les tuiles disponibles sur ce site web où l’on peut centrer le monde sur sa zone d’étude et voir ce que donnent les différentes familles de tuiles.
A titre d’exemple, les tuiles Stamen.Watercolor donnent une touche pastel artistique à la carte :
Tandis que la couche Esri.WorldTopoMap fournit une imagerie précise mais de couleurs plus neutre que les tuiles OpenStreetMap , ce qui sera intéressant si on superspose des marqueurs de couleur vive.
L’usage le plus fréquent de leafletconsiste à ajouter des éléments de localisation ponctuelle appelés markerset de rendre ces objets ponctuels interactifs avec l’ouverture de fenêtres popupslorsqu’on clique dessus avec la souris. On va donc voir pas à pas comment construire de telles cartes interactives en partant du cas le plus simple (marqueur unique) pour aller vers les cas plus complexes (ensemble de marqueurs de taille, couleur et formes différentes).
Nous allons commencer par indiquer l’emplacement de la place de la gare de Sucy-en-Brie sur notre carte précédente à l’aide de la fonction addMarkers() :
On constate que le marqueur donne bien la position choisi mais n’est pas interactif. Il faut ajouter plus de paramètres pour assurer l’interactivité.
Ajout d’un labelou d’un popup
On peut définir deux comportements d’un marker selon que la souris ne fait que passer dessus (label) ou selon que l’utilisateur effectue un click sur marker et déclenche l’ouverture d’une fenêtre (popup). Dans sa version la plus simple, l’interactivité consiste à ajouter une chaîne de caractère à ces deux paramètres.
icone_gare <-makeIcon(iconUrl ="img/gare_sucy_coord_googlemap.png")map <-leaflet() %>%addProviderTiles('Esri.WorldTopoMap') %>%setView(lat =48.77141, lng=2.50870, zoom =12) %>%addMarkers(lat =48.77141, lng=2.50870,# En passant la sourislabel ="GARE DE SUCY-BONNEUIL", # En cliquant sur l'iconepopup ="La gare RER A de Sucy Bonneuil est bien reliée aux communes environnantes par un réseau de bus partant dans toutes les directions")map
Amélioration du popup
Mais on peut faire beaucoup mieux, notamment pour la fenêtre popupqui peut prendre la forme d’une mini-page web dont on fixe le contenu en html avec la fonction paste0() et les dimensions avec le sous-paramètre popupOptions().
# Préparation de la fenêtre Popup my_popup =paste0("<b> LA GARE DE SUCY","</b><br/><img src=https://upload.wikimedia.org/wikipedia/commons/thumb/6/68/Gare_Sucy-en-Brie.jpg/1200px-Gare_Sucy-en-Brie.jpg width='200px'><br/>","La gare RER A de Sucy Bonneuil est bien reliée aux communes environnantes par un réseau de bus partant dans toutes les directions.")# Réalisation de la cartemap <-leaflet() %>%addProviderTiles('Esri.WorldTopoMap') %>%setView(lat =48.77141, lng=2.50870, zoom =12) %>%addMarkers(lat =48.77141, lng=2.50870,# En passant la sourislabel ="GARE DE SUCY-BONNEUIL", # En cliquant sur l'iconepopup = my_popup, # Quelques options de la popuppopupOptions =list(maxHeight =150, maxWidth =200))map
Prolongements
Et voila, le tour est joué. Il faut maintenant réfléchir à la façon de construire une carte comportant un ensemble d’épingles similaires avec des couleurs ou des formes différentes, des messages différents, des photographies variées … Il ne sera alors évidemment pas possible d’ajouter une commande addMarkers() pour chaque épingle si la carte en comporte des centaines.
Nous allons prendre comme exemple la cartographie des ventes de maisons issues de la base de données dvf qui a fait l’objet du cours.
Préparation des données
On télécharge à titre d’exemple les ventes de maison à Sucy-en-Brie en 2020 en ne conservant que celles pour lesquelles on dispose de la surface du logement et de celle du terrain.
latitude longitude nbp surf_bat
Min. :48.76 Min. :2.508 Min. : 1.000 Min. : 20.0
1st Qu.:48.76 1st Qu.:2.515 1st Qu.: 4.000 1st Qu.: 81.0
Median :48.77 Median :2.521 Median : 5.000 Median :110.0
Mean :48.77 Mean :2.525 Mean : 4.775 Mean :118.2
3rd Qu.:48.77 3rd Qu.:2.532 3rd Qu.: 6.000 3rd Qu.:146.0
Max. :48.78 Max. :2.561 Max. :11.000 Max. :384.0
surf_ter val prixm2
Min. : 40.0 Min. :100000 Min. : 970.9
1st Qu.: 324.0 1st Qu.:370000 1st Qu.: 3687.2
Median : 400.0 Median :468500 Median : 4263.2
Mean : 451.5 Mean :488648 Mean : 4614.2
3rd Qu.: 530.0 3rd Qu.:580000 3rd Qu.: 5185.2
Max. :1375.0 Max. :866140 Max. :18538.2
Cartographie des localisations
On commence par créer une carte des localisations des ventes de maison avec AddCircleMarkers()
# Réalisation de la cartemap <-leaflet() %>%addProviderTiles('Esri.WorldTopoMap') %>%setView(lat =48.77, lng=2.53, zoom =13) %>%addCircleMarkers(data=sel,lat =~latitude,lng =~longitude)map
Réglage de la taille des cercles
On règle la taille des cercles en fonction du nombre de pièces
# Calcul du diamètre des cercles sel$myradius <-10*sqrt(sel$nbp/max(sel$nbp,na.rm=T))# Réalisation de la cartemap <-leaflet() %>%addProviderTiles('Esri.WorldTopoMap') %>%setView(lat =48.77, lng=2.53, zoom =13) %>%addCircleMarkers(data=sel,lat =~latitude,lng =~longitude,radius=~myradius, # diamètrestroke=FALSE, # pas de bordure fillOpacity =0.5) # opacité map
Réglage de la couleur des cercles
On fait varier la couleur des cercles en fonction du prix au m2
# Calcul du diamètre des cercles sel$myradius <-10*sqrt(sel$nbp/max(sel$nbp,na.rm=T))summary(sel$prixm2)
Min. 1st Qu. Median Mean 3rd Qu. Max.
970.9 3687.2 4263.2 4614.2 5185.2 18538.2
# Choix des classes mycut<-round(quantile(sel$prixm2,probs =c(0,0.2,0.4,0.6,0.8,1)),0)# Choix de la palette (c'est une fonction !) mypal <-colorBin('Spectral', reverse = T, sel$prixm2,bins=mycut)# Réalisation de la cartemap <-leaflet() %>%addProviderTiles('Esri.WorldTopoMap') %>%setView(lat =48.77, lng=2.53, zoom =13) %>%addCircleMarkers(data=sel,lat =~latitude,lng =~longitude,radius=~myradius, # diamètrestroke=TRUE, # bordure weight=1 , # épaisseur de la bordurecolor="black", # couleur de la bordureopacity =0.7 , # opacité de la bordure fillOpacity =0.5, # opacité fillColor =~mypal(prixm2) ) %>%addLegend(data = sel,pal = mypal, title ="Prix / m2",values =~prixm2, position ='topright') map
Ajout d’un popup d’information
On rajoute un popup pour afficher toutes les informations sur chaque vente
# Calcul du diamètre des cercles sel$myradius <-10*sqrt(sel$nbp/max(sel$nbp,na.rm=T))# Choix des classes mycut<-round(quantile(sel$prixm2,probs =c(0,0.2,0.4,0.6,0.8,1)),0)# Choix de la palette (c'est une fonction !) mypal <-colorBin('Spectral', reverse = T, sel$prixm2,bins=mycut)# Préparation des popups mypopups <-lapply(seq(nrow(sel)), function(i) {paste0( paste("Prix de vente : " ,sel$val[i]), '<br>', paste("Nb. de pièces : " ,sel$nbp[i]), '<br>', paste("Surface du logement : ", sel$surf_bat[i]), '<br>',paste("Surface du terrain : " ,round(sel$surf_ter[i],1))) }) mypopups<-lapply(mypopups, htmltools::HTML) # Réalisation de la cartemap <-leaflet() %>%addProviderTiles('Esri.WorldTopoMap') %>%setView(lat =48.77, lng=2.53, zoom =13) %>%addCircleMarkers(data=sel,lat =~latitude,lng =~longitude,radius=~myradius, # diamètrestroke=TRUE, # bordure weight=1 , # épaisseur de la bordurecolor="black", # couleur de la bordureopacity =0.7 , # opacité de la bordure fillOpacity =0.5, # opacité fillColor =~mypal(prixm2),popup = mypopups, ) %>%addLegend(data = sel,pal = mypal, title ="Prix au m2",values =~prixm2, position ='topright') map
Choix des tuiles
On fait varier les tuiles pour offrir la possibilité de visualiser la position des maisons sur un plan ou sur une photo aérienne.
# Calcul du diamètre des cercles sel$myradius <-10*sqrt(sel$nbp/max(sel$nbp,na.rm=T))summary(sel$prixm2)
Min. 1st Qu. Median Mean 3rd Qu. Max.
970.9 3687.2 4263.2 4614.2 5185.2 18538.2
# Choix des classes mycut<-round(quantile(sel$prixm2,probs =c(0,0.2,0.4,0.6,0.8,1)),0)# Choix de la palette (c'est une fonction !) mypal <-colorBin('Spectral', reverse = T, sel$prixm2,bins=mycut)# Préparation des popups mypopups <-lapply(seq(nrow(sel)), function(i) {paste0( paste("Prix de vente : " ,sel$val[i]), '<br>', paste("Nb. de pièces : " ,sel$nbp[i]), '<br>', paste("Surface du logement : ", sel$surf_bat[i]), '<br>',paste("Surface du terrain : " ,round(sel$surf_ter[i],1))) }) mypopups<-lapply(mypopups, htmltools::HTML) # Réalisation de la cartemap <-leaflet() %>%# TuilesaddTiles(group ="OSM ") %>%addProviderTiles('Esri.WorldTopoMap', group ="ESRI topo.") %>%addProviderTiles('Esri.WorldImagery', group ="ESRI photo.") %>%# Contrôle des tuilesaddLayersControl( baseGroups =c("OSM","ESRI topo.","ESRI photo."),position ="bottomright") %>%setView(lat =48.77, lng=2.53, zoom =13) %>%addCircleMarkers(data=sel,lat =~latitude,lng =~longitude,radius=~myradius, # diamètrestroke=TRUE, # bordure weight=1 , # épaisseur de la bordurecolor="black", # couleur de la bordureopacity =0.7 , # opacité de la bordure fillOpacity =0.5, # opacité fillColor =~mypal(prixm2),popup = mypopups, ) %>%addLegend(data = sel,pal = mypal, title ="Prix au m2",values =~prixm2, position ='topright') map
Exercice n°1
Construire une carte interactive des ventes d’appartement dans le 13e arrondissement en 2021 en adaptant légèrement le programme précédent (en particulier : ne plus retenir la surface du terrain)
Min. 1st Qu. Median Mean 3rd Qu. Max.
0 8540 9889 14891 11538 683333
Exercice n°2
En repartant du programme précédent, construire une fonction d’affichage cartographique du prix des appartements pour n’importe quel code INSEE et n’importe quelle date.
On applique au 16e arrondissemen en 2018
visu_appart("75116","2018")
On applique à Fontenay-Sous-Bois en 2015 :
visu_appart("94033","2015")
Exercice n°3
Quels sont les avantages et inconvénients du téléchargement interactif des données à l’aide d’une API ?
Commet pourriez vous procéder pour obtenir une fonction d’affichage plus rapide ?
On peut alors procéder à une double opération de centrage de notre carte et de définition d’une échelle d’observation afin que la carte produite par